<template>
    <div>
        <div>
            <el-row :gutter="20">
                <el-col :span="4" :offset="0">
                    <el-card class="box-card"
                        style="background-color:white;border: 1px solid black;height: 800px;width: 240px;">
                        <p>月度考评</p>
                        <br />
                        <el-select v-model="schemeName" placeholder="请选择" size="small" style="width: 140px"
                            @change="getMySolution" clearable>
                            <el-option v-for="item in schemeNameList" :label="item.schemeName"
                                :value="item.schemeName" />
                        </el-select>
                    </el-card>
                </el-col>
                <el-col :span="20" :offset="0">
                    <el-card class="box-card"
                        style="background-color:white;border: 1px solid black;height: 100px;width: 1200px;">
                        <el-form :inline="true" :model="serchData" class="demo-form-inline">
                            <el-form-item label="考核类型">
                                <el-select v-model="serchData.assessmentType" placeholder="请选择" style="width: 120px;"
                                    clearable>
                                    <el-option label="月度考核" value="月度考核" />
                                </el-select>
                            </el-form-item>
                            <el-form-item label="方案名称">
                                <el-input v-model="serchData.schemeName" placeholder="请输入" clearable
                                    style="width: 200px;" />
                            </el-form-item>
                            <el-form-item label="考核对象">
                                <el-input v-model="serchData.assessmentObject" placeholder="请输入" clearable
                                    style="width: 200px;" />
                            </el-form-item>
                            <el-form-item>
                                <el-button type="success" @click="getAssessmentSchemeList">搜索</el-button>
                            </el-form-item>
                        </el-form>
                    </el-card>
                    <br /><br />
                    <el-table border :data="assessmentSchemeList" style="width: 100%">
                        <el-table-column type="index" label="序号" width="60" align="center" :index="indexMethod" />
                        <el-table-column prop="schemeName" label="方案名称" align="center" />
                        <el-table-column prop="assessmentType" label="考核类型" align="center" />
                        <el-table-column prop="assessmentCycle" label="时间" align="center">
                            <template v-slot="spoce">
                                {{ spoce.row.assessmentCycle.substring(0,
                                    4) }}年{{ spoce.row.assessmentCycle.substring(5, 7) }}月
                            </template>
                        </el-table-column>
                        <el-table-column prop="assessmentObject" label="考核对象" align="center" />
                        <el-table-column label="客观分" align="center">
                            <template v-slot="spoce">
                            </template>
                        </el-table-column>
                        <el-table-column label="主观分" align="center">
                            <template v-slot="spoce">
                                <el-link type="primary" size="small" @click="SetUp(spoce.row.id)">评分</el-link>
                            </template>
                        </el-table-column>
                    </el-table>

                    <!-- 分页 -->
                    <table style="margin: 5px auto;">
                        <tbody>
                            <tr>
                                <td>
                                    <el-pagination v-model:current-page="page.pageIndex"
                                        v-model:page-size="page.pageSize" :page-sizes="[15, 20, 25, 30]" background
                                        layout="slot" :total="page.totalCount" @size-change="handleSizeChange"
                                        @current-change="handleCurrentChange" prev-text="上一页" next-text="下一页">
                                        <span>
                                            共 {{ page.totalCount }} 条，共 {{ page.pageCount }} 页，当前 {{ page.pageIndex }} /
                                            {{
                                                page.pageCount
                                            }} 页
                                        </span>
                                    </el-pagination>
                                </td>
                                <td>
                                    <el-pagination v-model:current-page="page.pageIndex"
                                        v-model:page-size="page.pageSize" :page-sizes="[15, 20, 25, 30]" background
                                        layout="sizes, slot,prev, pager, next" :total="page.totalCount"
                                        @size-change="handleSizeChange" @current-change="handleCurrentChange"
                                        prev-text="上一页" next-text="下一页">
                                        <span>
                                            <button @click="handleCurrentChange(1)"
                                                :disabled="page.pageIndex == 1">首页</button>
                                        </span>
                                    </el-pagination>
                                </td>
                                <td>
                                    <el-pagination v-model:current-page="page.pageIndex"
                                        v-model:page-size="page.pageSize" :page-sizes="[15, 20, 25, 30]" background
                                        layout="slot,jumper" :total="page.totalCount" @size-change="handleSizeChange"
                                        @current-change="handleCurrentChange" prev-text="上一页" next-text="下一页">
                                        <span>
                                            <button @click="handleCurrentChange(page.pageCount)"
                                                :disabled="page.pageIndex == page.pageCount">尾页</button>
                                        </span>
                                    </el-pagination>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </el-col>
            </el-row>
        </div>
        <el-dialog v-model="dialogVisible" title="选择主观考核指标" width="65%">
            <el-row :gutter="20">
                <el-col :span="21" :offset="0">
                    <el-table :data="SchemeAssessmentIndexTable" border style="width: 100%">
                        <el-table-column prop="indexName" label="指标名称" align="center" />
                        <el-table-column prop="indexDesc" label="指标描述" align="center" />
                        <el-table-column prop="indexWeight" label="指标权重" align="center" />
                        <el-table-column prop="maximumFraction" label="最大分" align="center" />
                        <el-table-column prop="leastMinute" label="最小分" align="center" />
                        <el-table-column prop="initialScore" label="初始分" align="center" />
                        <el-table-column label="评分" align="center">
                        </el-table-column>
                        <el-table-column label="得分" align="center">
                        </el-table-column>
                        <el-table-column label="评分意见" align="center" />
                    </el-table>
                </el-col>
                <el-col :span="3" :offset="0">
                    <tr>
                        <td>
                            综合评分
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <el-card class="box-card"
                                style="background-color:white;border: 1px solid black;height: 120px;width: 100px;">
                            </el-card>
                        </td>
                    </tr>
                </el-col>
            </el-row>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="dialogVisible = false">取消</el-button>
                    <el-button type="primary" @click="add">
                        提交
                    </el-button>
                </span>
            </template>
        </el-dialog>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted, inject } from 'vue'
import { ElMessage, ElMessageBox, ElTree } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import type { AxiosStatic } from "axios"
import { useRouter } from 'vue-router'
const axios = inject('axios') as AxiosStatic
const ruleFormRef = ref<FormInstance>()
const router = useRouter()


const dialogVisible = ref(false)

interface IschemeNameList {
    id: number,
    schemeName: string
}

//考核方案名称条件查询(非常重要)
const schemeName = ref('')

//考核方案管理的方案名称
const schemeNameList = ref<IschemeNameList[]>([])
const getschemeNameList = () => {
    //http://localhost:5171
    axios.get('http://47.95.178.186:8000/ExamineGetRout/api/AssessmentSchemeRead/GetSchemeNameDto').then(res => {
        schemeNameList.value = res.data.result
    })
}

const Id = ref(0)

const SchemeAssessmentIndexTable = ref([])
const SetUp = (id: number) => {
    Id.value = id
    dialogVisible.value = true
    axios.get('http://47.95.178.186:8000/ExamineGetRout/api/AssessmentSchemeRead/GetSchemeAssessmentIndexQuery', {
        params: {
            id: id
        }
    }).then(res => {
        if (res.data.code == 200) {
            SchemeAssessmentIndexTable.value = res.data.result
        }
    })
}

const evaluation = reactive({
    "gridName": "",
    "meshLength": "",
    "objectiveScoring": "50",
    "subjectiveRating": "50"
})

const add = () => {
    axios.post('http://47.95.178.186:8000/ExamineSetRout//api/AssessmentScheme/AddEvaluateResult', evaluation).then(res => {
        if (res.data.code == 200) {
            ElMessage({
                message: '提交成功',
                type: 'success',
            })
        }
    })

    setTimeout(() => {
        axios.put('http://47.95.178.186:8000/ExamineSetRout//api/AssessmentScheme/UpdateEvaluateResult?id=' + Id.value).then(res => {
            if (res.data.code == 200) {
                getAssessmentSchemeList()
            }
        })
    }, 200);
    dialogVisible.value = false
}

//方案管理查询条件
const serchData = reactive({
    assessmentType: "",
    schemeName: "",
    assessmentObject: "",
})

//方案管理分页数据
const page = reactive({
    pageIndex: 1,
    pageSize: 15,
    totalCount: 0,
    pageCount: 0,
})

const handleSizeChange = (val: number) => {
    page.pageIndex = 1
    page.pageSize = val
    getAssessmentSchemeList()
}

const handleCurrentChange = (val: number) => {
    page.pageIndex = val
    getAssessmentSchemeList()
}

//考核方案数据显示
const assessmentSchemeList = ref([])
const getAssessmentSchemeList = () => {
    axios.get('http://47.95.178.186:8000/ExamineGetRout/api/AssessmentSchemeRead/GetAssessmentSchemeLists', {
        params: {
            pageIndex: page.pageIndex,
            pageSize: page.pageSize,
            assessmentType: serchData.assessmentType,
            schemeName: serchData.schemeName,
            assessmentObject: serchData.assessmentObject
        }
    }).then(res => {
        if (res.data.code == 200) {
            assessmentSchemeList.value = res.data.result.data
            page.totalCount = res.data.result.totalCount
            page.pageCount = res.data.result.pageCount
        }
    })
}

const getMySolution = () => {
    axios.get('http://47.95.178.186:8000/ExamineGetRout/api/AssessmentSchemeRead/GetAssessmentSchemeLists', {
        params: {
            pageIndex: page.pageIndex,
            pageSize: page.pageSize,
            assessmentType: "" || null,
            schemeName: schemeName.value || null,
            assessmentObject: "" || null
        }
    }).then(res => {
        if (res.data.code == 200) {
            assessmentSchemeList.value = res.data.result.data
            page.totalCount = res.data.result.totalCount
            page.pageCount = res.data.result.pageCount
        }
    })
}

//序号
const indexMethod = (index: number) => {
    return index += (page.pageSize) * (page.pageIndex - 1) + 1;
}

onMounted(() => {
    getschemeNameList()
    setTimeout(() => {
        getAssessmentSchemeList()
    }, 500);
})
</script>

<style></style>